<template>
<view>
<form @submit="formSubmit">
    <view class="serch_view">
        <view class="serch_border">
            <image class="serch_border_img" src="/static/pages/image/sousuo_btn.png"></image>
            <input @input="bindKeyInput" class="serch_border_text" :focus="true" name="name" placeholder="请输入关键字进行搜索" placeholderStyle="font-size: 24rpx;color: #B2B2B2;" type="text" :value="inputVal">
        </view>
        <button class="serch_border_btn btn_active" form-type="submit" v-if="inputVal">搜索</button>
        <button @tap="click_val" class="serch_border_btn" v-else>取消</button>
        <image @tap="cant" class="close_img" src="/static/pages/home/image/gb_btn.png" v-if="inputVal"></image>
    </view>
</form>
<view class="mohu_border_view" v-if="res.length>0">
    <view class="mohu_border">
        <view class="mohu_border_modle mohu_border_modle_first">搜索{{inputVal}}店铺</view>
        <form v-for="(item, index) in res" :key="index" @submit="shop_id" reportSubmit="true">
            <input hidden="true" name="shopid" :value="item.id">
            <button class="mohu_border_modle" form-type="submit">{{item.unickname}}</button>
        </form>
    </view>
</view>
<view class="serch_nav"></view>
<view class="biaoqian_border_all" v-if="keywordArr.length>0">
    <view class="biaoqian_modle">
        <view class="biaoqian_title">历史搜索
            <view @tap="del" class="biaoqian_title_right">删除</view>
        </view>
    </view>
    <view class="biaoqian_border">
        <view v-for="(item, index) in keywordArr" :key="index" @tap="searchPage" class="biaoqian" :data-name="item">
                {{item}}
            </view>
    </view>
</view>
</view>
</template>

<script>
var app = getApp();

export default {
  data() {
    return {
      focus: !1,
      inputValue: "",
      heatShop: [],
      shop: [],
      res: [],
      heatShops: [],
      keywordArr: [],
      inputVal: ""
    };
  },

  components: {},
  props: {},
  onLoad: function () {
    var e = this;
    app.globalData.siteInfo.uniacid;
    this.setData({
      keywordArr: wx.getStorageSync("keywordArr")
    }), app.globalData.util.request({
      url: "entry/wxapp/Api",
      data: {
        m: "monai_market",
        r: "home.index.search_detail"
      },
      cachetime: "0",
      success: function (a) {
        console.log(a), e.setData({
          shop: a.data.data
        });
      }
    });
  },
  methods: {
    bindKeyInput: function (a) {
      app.globalData.siteInfo.uniacid;

      for (var e = [], t = a.detail.value, n = this.shop, r = 0; r < n.length; r++) {
        n[r].unickname.match(t) && e.push(n[r]);
      }

      this.setData({
        res: e,
        inputVal: t
      });
    },
    range: function () {
      var a,
          e,
          t = this.heatShops,
          n = t.length;
      if (n) for (; --n;) a = t[e = Math.floor(Math.random() * (n + 1))], t[e] = t[n], t[n] = a;
      this.setData({
        heatShop: t.slice(0, 7)
      });
    },
    searchPage: function (a) {
      var e = app.globalData.getAttr(a, "name");
      wx.navigateTo({
        url: "/pagesA/home/index/index?name=" + e
      });
    },
    del: function () {
      wx.setStorageSync("keywordArr", []), this.setData({
        keywordArr: []
      });
    },
    formSubmit: function (a) {
      var e = wx.getStorageSync("keywordArr") || [],
          t = a.detail.value.name;
      if (0 < e.length) for (var n = 0; n < e.length; n++) if (e[n] == t.trim()) {
        e.splice(n, 1);
        break;
      }
      e.unshift(t), 10 <= e.length && e.pop(), wx.setStorageSync("keywordArr", e), this.setData({
        keywordArr: e
      }), wx.navigateTo({
        url: "/pages/home/index/index?name=" + t
      });
    },
    shop_id: function (a) {
      var e = a.detail.value.shopid;
      wx.navigateTo({
        url: "/pagesA/home/carMessage/carMessage?id=" + e
      });
    },
    cant: function () {
      this.setData({
        res: [],
        inputVal: ""
      });
    },
    click_val: function (a) {
      wx.navigateBack({});
    }
  }
};
</script>
<style>
@import "./searchShop.css";
</style>